
const cartbox = document.querySelector('.cart_shopping')
// 购物车数据列表
let cartList = []
//接收登录页传过来的数据 
let username = getQueryVariable('name')
let index =  getQueryVariable('index')
// 接收储存到的信息
let session = JSON.parse(window.sessionStorage.getItem(index))
 if(username){
    $('.top_left').css('display', 'none')
    $('.top_left_hide').css('display','block')
    $('.top_left_hide >li > p').html(username)

    $('.top_left_hide a').on('click',function(){
        $('.top_left').css('display', 'block')
        $('.top_left_hide').css('display','none')
        window.location.href="./index.html"
    })
 }
// 购物车按钮
// 获取localStorage里面的数据放到cartList 初始化購物車列表
fillCartList()
function fillCartList() {
    cartList = []
    for (var i = 0; i < localStorage.length; i++) {
        var key = localStorage.key(i)

        cartList.push(JSON.parse(localStorage[key]))
    }
    bindCart()
}
//  渲染购物车
function bindCart() {
    // 重新获取数据
    // 如果购物车里没货,不执行   
    if (!cartList.length || username == false ) {
        cartbox.innerHTML = `
           <div class='kong'>
            购物车里还没有商品,<br>
            快去挑选心爱的商品吧~
           <div>
         `
    } else {       
        let totalPrice = 0
        let num = 0
        // 渲染num 数量
        if(cartList.length){        
            $('.num').css('display','block').html(cartList.length)
        }
        cartList.forEach(e => {
            let unitPrice = e.deal_global ? e.deal_global.price_home : e.deal_group.price_dis
            
            totalPrice += (e.report_number + 1) * unitPrice
            num += parseInt(e.report_number + 1)
        })
        
        var str = template('cart_tmp', {
            list: cartList,
            num: num,
            price: totalPrice

        })
        cartbox.innerHTML = str
    }
}
// 各种移入显示  public 里面的函数
hoverXianshi('.me_jm')
hoverXianshi('.right_more')
hoverXianshi('.shopping-cart')

// 渲染页面
bindhtml()
function bindhtml(){
    let str = template('tmp',{
        data:session
    })
    $('.center_top').html(str)
}

bingNav()
hide_nav('nav')


// 放大镜

// 移入显示
magnifier()
function magnifier(){
    // 移入显示 移出隐藏
    $('.center_top').on('mouseenter',".center_top_left",function(e){
        $('.magnBox').stop().fadeIn(600)
        $('.center_hide').stop().fadeIn(600)
    })
    $('.center_top').on('mouseleave',".center_top_left",function(e){
        $('.magnBox').stop().fadeOut(600)
        $('.center_hide').stop().fadeOut(600)
    })
    $('.center_top').on('mousemove',".center_top_left",function(e){
        let x = e.offsetX
        let y = e.offsetY
        let boxW  = $('.center_top_left').width()
        let boxH  = $('.center_top_left').height()
        // 設置边界
        if(x <= $('.magnBox').width() / 2 ){
            x = $('.magnBox').width() / 2
        }else if( x >=  boxW -  $('.magnBox').width() / 2 ){
            x =  boxW -  $('.magnBox').width() / 2
        }
        if(y <= $('.magnBox').height() / 2 ){
            y = $('.magnBox').height() / 2
        }else if( y >=  boxH -  $('.magnBox').height() / 2 ){
            y =  boxH -  $('.magnBox').height() / 2
        }
        $('.magnBox').css({
           "left":x - $('.magnBox').width() / 2 ,
           "top":y - $('.magnBox').height() / 2 
       })
        //设置放大图像的位置
        //计算比例
        let proportion = $('.center_hide').width() / $('.magnBox').width()
        $('.center_hide_img').css({
            "left": -(x - $('.magnBox').width() / 2) * proportion,
            "top":-(y - $('.magnBox').height() / 2)* proportion
        })

    })

}

// 点击事件
btnClick()
function btnClick(){
    $('.center_top_right').on('click',function(e){
        let target = e.target
        let num = parseInt($('.center_inp').val())
        if(target.className == 'center_num+'){
            num++
            if(num > 10){
                return
            }
           $('.center_inp').val(num)
        }
        if(target.className == 'center_num-'){
            num--
            if(num < 1){
                $('.center_num-').css('background',"#ccc")
                return
            }
            $('.center_inp').val(num)
        }
        if(target.className == 'tianjia_btn'){
            // 点击添加到local 中
            local(session,index,num)
            donghua(e.pageX,e.pageY)
            // 重新获取数据 渲染购物车
            fillCartList()
        }

    })
    
    $('.center_inp').on('input',function(){
        if($('.center_inp').val() >= 10){
            $('.center_inp').val(10)
        }
        else if($('.center_inp').val() <= 0){
            $('.center_inp').val(1)
        }
    })
}
// 去往购物车链接
 goCart()